<template>
  <div id="personApplyCheck" class="app-container">
    <div class="module-box">
      <el-form ref="individualApplyVo" :model="validateForm.individualApplyVo" :rules="rules.individualApplyVo" class="form" label-position="right" label-width="230px">
        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">基本信息</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <el-col :span="12">
              <el-form-item label="姓名：" prop="applicantName">
                <el-input v-model="validateForm.individualApplyVo.applicantName" />
              </el-form-item>
              <el-form-item label="代理人姓名：">
                <el-input v-model="validateForm.individualApplyVo.agentName" />
              </el-form-item>
              <el-form-item label="手机号码：" prop="mobilePhone">
                <el-input v-model="validateForm.individualApplyVo.mobilePhone" />
              </el-form-item>
              <el-form-item label="复垦类型：" prop="reclaimTypeId">
                <el-select placeholder="--请选择--" v-model="validateForm.individualApplyVo.reclaimTypeId" clearable>
                  <el-option v-for="(item, index) in RECLAIM_TYPE" :key="index" :label="item.name" :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="区域：" prop="regionId">
                <el-cascader style="width: 300px" v-model="regionArr" :props="props"></el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="身份证号：" prop="applicantNum">
                <el-input v-model="validateForm.individualApplyVo.applicantNum" />
              </el-form-item>
              <el-form-item label="代理人身份证号：">
                <el-input v-model="validateForm.individualApplyVo.agentNum" />
              </el-form-item>
              <el-form-item label="通讯地址：" prop="address">
                <el-input v-model="validateForm.individualApplyVo.address" />
              </el-form-item>
              <el-form-item label="复垦去向：" prop="reclaimWhereId">
                <el-select placeholder="--请选择--" v-model="validateForm.individualApplyVo.reclaimWhereId" clearable>
                  <el-option v-for="(item, index) in RECLAIM_WHERE" :key="index" :label="item.name" :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
          </div>
        </div>

        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">家庭成员信息</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <div class="filter-container">
              <el-button @click="handleAddFamilyList" class="filter-item" type="primary">添加</el-button>
            </div>

            <el-table :data="validateForm.individualApplyVo.familyMemberList" highlight-current-row>
              <el-table-column prop="name" label="姓名"></el-table-column>
              <el-table-column prop="relation" label="与申请人关系"></el-table-column>
              <el-table-column prop="mobile" label="手机号码"></el-table-column>
              <el-table-column prop="num" label="身份证号码"></el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <el-button @click="handleEditFamily(scope.$index, scope.row)" type="text">修改</el-button>
                  <el-button @click="handleDelFamily(scope.$index)" type="text">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>

        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">权证信息</span>
          </div>
          <div class="form module-item-content" style="padding-top:35px;overflow: hidden;">
            <el-col :span="12">
              <el-form-item label="证件类型：" prop="certificateTypeId">
                <el-select placeholder="--请选择--" v-model="validateForm.individualApplyVo.certificateTypeId" clearable>
                  <el-option v-for="(item, index) in CERTIFICATE_TYPE" :key="index" :label="item.name" :value="item.id" />
                </el-select>
              </el-form-item>
              <el-form-item label="发证时间：" prop="issueCertificateDate">
                <el-date-picker type="date" placeholder="--请选择--" v-model="validateForm.individualApplyVo.issueCertificateDate"></el-date-picker>
              </el-form-item>
              <el-form-item label="权利人：" prop="obligeeName">
                <el-input v-model="validateForm.individualApplyVo.obligeeName" />
              </el-form-item>
              <el-form-item label="是否愿意预留农村发展指标：" prop="isRemain">
                <el-select placeholder="--请选择--" v-model="validateForm.individualApplyVo.isRemain" clearable>
                  <el-option label="是" value="YES" />
                  <el-option label="否" value="NO" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="证件号码：" prop="certificateNum">
                <el-input v-model="validateForm.individualApplyVo.certificateNum" />
              </el-form-item>
              <el-form-item label="土地使用权面积：" prop="landArea">
                <el-input v-model="validateForm.individualApplyVo.landArea">
                  <span slot="suffix">公顷</span>
                </el-input>
              </el-form-item>
              <el-form-item label="土地坐落：" prop="landAddress">
                <el-input v-model="validateForm.individualApplyVo.landAddress" />
              </el-form-item>
            </el-col>
          </div>
        </div>

        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">附件信息</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <el-table :data="fileList" highlight-current-row>
              <el-table-column type="index" label="序号"></el-table-column>
              <el-table-column prop="type" label="类型" width="200"></el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <upload @beforeUpload="handleBeforeUpload" @res="handleUpload($event, scope.$index)" />
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </el-form>

      <el-form ref="individualVillageAuditVo" :model="validateForm.individualVillageAuditVo" :rules="rules.individualVillageAuditVo" class="form" label-position="right">
        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">附件信息审核</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <div class="form-inline-item">
              <el-form-item class="fujianShenClass" label="1、身份证正面审核">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.attachment1Audit">
                  <el-radio label="YES">通过</el-radio>
                  <el-radio label="NO">未通过</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="fujianShenClass" label="2、身份证反面审核,">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.attachment2Audit">
                  <el-radio label="YES">通过</el-radio>
                  <el-radio label="NO">未通过</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="fujianShenClass" label="3、户口簿家庭成员关系审核">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.attachment3Audit">
                  <el-radio label="YES">通过</el-radio>
                  <el-radio label="NO">未通过</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="fujianShenClass" label="4、权证证明审核">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.attachment4Audit">
                  <el-radio label="YES">通过</el-radio>
                  <el-radio label="NO">未通过</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="fujianShenClass" label="4、农户去向证明审核">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.attachment5Audit">
                  <el-radio label="YES">通过</el-radio>
                  <el-radio label="NO">未通过</el-radio>
                </el-radio-group>
              </el-form-item>
            </div>
          </div>
        </div>
        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">审核信息 - 村社审核意见</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <div class="form-inline-item">
              <el-form-item label="1、申请复垦的宅基地现状是否为建设用地？" prop="option1Audit">
                <el-radio-group @change="changeType($event,1)" v-model="validateForm.individualVillageAuditVo.option1Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option1Explain" v-if="option1TypeList.option1Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option1Explain" />
              </el-form-item>
              <el-form-item label="2、申请复垦的宅基地不属于夹心或连体房？" prop="option2Audit">
                <el-radio-group @change="changeType($event,2)" v-model="validateForm.individualVillageAuditVo.option2Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option2Explain" v-if="option1TypeList.option2Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option2Explain" />
              </el-form-item>
              <el-form-item label="3、申请人身份信息是否属实？" prop="option3Audit">
                <el-radio-group @change="changeType($event,3)" v-model="validateForm.individualVillageAuditVo.option3Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option3Explain" v-if="option1TypeList.option3Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option3Explain" />
              </el-form-item>
              <el-form-item label="4、申请人家庭成员情况是否属实？" prop="option4Audit">
                <el-radio-group @change="changeType($event,4)" v-model="validateForm.individualVillageAuditVo.option4Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option4Explain" v-if="option1TypeList.option4Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option4Explain" />
              </el-form-item>
              <el-form-item label="5、宅基地权证信息是否属实？" prop="option5Audit">
                <el-radio-group @change="changeType($event,5)" v-model="validateForm.individualVillageAuditVo.option5Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option5Explain" v-if="option1TypeList.option5Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option5Explain" />
              </el-form-item>
              <el-form-item label="6、申请人类型是否属实？" prop="option6Audit">
                <el-radio-group @change="changeType($event,6)" v-model="validateForm.individualVillageAuditVo.option6Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option6Explain" v-if="option1TypeList.option6Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option6Explain" />
              </el-form-item>
              <el-form-item label="7、申请人去向是否属实？" prop="option7Audit">
                <el-radio-group @change="changeType($event,7)" v-model="validateForm.individualVillageAuditVo.option7Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option7Explain" v-if="option1TypeList.option7Type">
                <el-input type="textarea" v-model="validateForm.individualVillageAuditVo.option7Explain" />
              </el-form-item>
            </div>
            <div class="layout-box">
              <el-divider></el-divider>
              <span class="title">集体经济组织经过审查</span>
              <el-form-item label="是否同意申请复垦" prop="auditResult">
                <el-radio-group v-model="validateForm.individualVillageAuditVo.auditResult">
                  <el-radio label="APPROVED">同意</el-radio>
                  <el-radio label="REJECTED">不同意</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="村审核人姓名：" prop="auditUserId">
                <el-select @change="handleAuditUserChange($event, 'auditor1')" placeholder="--请选择--" v-model="validateForm.individualVillageAuditVo.auditUserId" clearable>
                  <el-option v-for="(item, index) in auditorData" :key="index" :label="item.name" :value="item.userId" />
                </el-select>
              </el-form-item>
              <el-form-item label="村审核人职务：">
                <el-input readonly v-model="auditorItem1.position" placeholder="请选择村审核人" />
              </el-form-item>
              <el-form-item label="联系电话：">
                <el-input readonly v-model="auditorItem1.mobilePhone" placeholder="请选择村审核人" />
              </el-form-item>
              <el-form-item label="审核日期：" prop="auditTime">
                <el-date-picker type="date" placeholder="--请选择--" v-model="validateForm.individualVillageAuditVo.auditTime"></el-date-picker>
              </el-form-item>
            </div>
          </div>
        </div>
      </el-form>

      <el-form ref="individualTownAuditVo" :model="validateForm.individualTownAuditVo" :rules="rules.individualTownAuditVo" class="form" label-position="right">
        <div class="module-item">
          <div class="module-item-title">
            <span class="tit">审核信息 - 乡镇街道意见</span>
          </div>
          <div class="module-item-content" style="padding-top:35px;overflow: hidden;">
            <div class="form-inline-item">
              <el-form-item label="1、申请资料要件是否齐全？" prop="option1Audit">
                <el-radio-group @change="changeStatus($event,1)" v-model="validateForm.individualTownAuditVo.option1Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option1Explain" v-if="option2TypeList.option1Type">
                <el-input type="textarea" v-model="validateForm.individualTownAuditVo.option1Explain" />
              </el-form-item>
              <el-form-item label="2、申请复垦的宅基地是否在城镇扩展边界之外" prop="option2Audit">
                <el-radio-group @change="changeStatus($event,2)" v-model="validateForm.individualTownAuditVo.option2Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option2Explain" v-if="option2TypeList.option2Type">
                <el-input type="textarea" v-model="validateForm.individualTownAuditVo.option2Explain" />
              </el-form-item>
              <el-form-item label="3、土地权属关系是否真实有效？" prop="option3Audit">
                <el-radio-group @change="changeStatus($event,3)" v-model="validateForm.individualTownAuditVo.option3Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option3Explain" v-if="option2TypeList.option3Type">
                <el-input type="textarea" v-model="validateForm.individualTownAuditVo.option3Explain" />
              </el-form-item>
              <el-form-item label="4、土地权属关系是否真实有效？" prop="option4Audit">
                <el-radio-group @change="changeStatus($event,4)" v-model="validateForm.individualTownAuditVo.option4Audit">
                  <el-radio label="YES">是</el-radio>
                  <el-radio label="NO">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item class="explain" label="说明：" prop="option4Explain" v-if="option2TypeList.option4Type">
                <el-input type="textarea" v-model="validateForm.individualTownAuditVo.option4Explain" />
              </el-form-item>
            </div>
            <div class="layout-box">
              <el-divider></el-divider>
              <span class="title">乡镇经过审查</span>
              <el-form-item label="是否同意上报" prop="auditResult">
                <el-radio-group v-model="validateForm.individualTownAuditVo.auditResult">
                  <el-radio label="APPROVED">同意</el-radio>
                  <el-radio label="REJECTED">不同意</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="村审核人姓名：" prop="auditUserId">
                <el-select @change="handleAuditUserChange($event, 'auditor2')" placeholder="--请选择--" v-model="validateForm.individualTownAuditVo.auditUserId">
                  <el-option v-for="(item, index) in auditorData" :key="index" :label="item.name" :value="item.userId" />
                </el-select>
              </el-form-item>
              <el-form-item label="村审核人职务：">
                <el-input readonly v-model="auditorItem2.position" placeholder="请选择村审核人" />
              </el-form-item>
              <el-form-item label="联系电话：">
                <el-input readonly v-model="auditorItem2.mobilePhone" placeholder="请选择村审核人" />
              </el-form-item>
              <el-form-item label="审核日期：" prop="auditTime">
                <el-date-picker type="date" placeholder="--请选择--" v-model="validateForm.individualTownAuditVo.auditTime"></el-date-picker>
              </el-form-item>
            </div>
          </div>
        </div>
      </el-form>

      <div class="submit-box">
        <el-button @click="handleSubmit" type="primary">提交</el-button>
        <el-button @click="handleCancel">取消</el-button>
      </div>

      <el-dialog @close="handleReset('familyForm')" :close-on-click-modal="false" width="30%" :title="familyMode=='add'?'添加家庭成员':'编辑家庭成员'" :visible.sync="familyDialog">
        <el-form ref="familyForm" :model="familyForm" :rules="familyRules" label-width="90">
          <el-form-item label="姓名：" prop="name">
            <el-input v-model="familyForm.name" placeholder="请输入姓名"></el-input>
          </el-form-item>
          <el-form-item label="与申请人关系：" prop="relation">
            <el-input v-model="familyForm.relation" placeholder="请输入与申请人关系"></el-input>
          </el-form-item>
          <el-form-item label="手机号码：" prop="mobile">
            <el-input v-model="familyForm.mobile" placeholder="请确认手机号码"></el-input>
          </el-form-item>
          <el-form-item label="身份证号码：" prop="num">
            <el-input v-model="familyForm.num" placeholder="请确认身份证号码"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="familyDialog = false">取 消</el-button>
          <el-button :loading="btnLoading" type="primary" @click="handleAddFamily">确 定</el-button>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { queryAllAuditor, getLandApplyType, individualApplySubmit, getRegionListByParentId } from "@/api/project/fksqtc/personApplyCheck";
import config from "@/config";
import upload from "@/views/upload";

export default {
  components: {
    upload
  },
  data() {
    return {
      validateForm: {
        individualApplyVo: {
          applicantName: "张三",
          applicantNum: 500234199305066000,
          agentName: "李四",
          agentNum: 50023419950509864,
          address: "开州区巫山乡冠宝村",
          mobilePhone: 18012345678,
          reclaimTypeId: "",
          reclaimWhereId: "",
          familyMemberList: [],
          certificateTypeId: "",
          certificateNum: "CQ-KX-ZJD000000001",
          issueCertificateDate: "2008-08-08",
          landArea: 59,
          obligeeName: "张三",
          landAddress: "开州区巫山乡冠宝村",
          isRemain: "YES",
          attachment1Id: null,
          attachment2Id: null,
          attachment3Id: null,
          attachment4Id: null,
          attachment5Id: null,
          regionId: null
        },
        individualVillageAuditVo: {
          attachment1Audit: "YES",
          attachment2Audit: "YES",
          attachment3Audit: "YES",
          attachment4Audit: "YES",
          attachment5Audit: "YES",
          auditTime: null,
          auditUserId: null,
          option1Audit: "YES",
          option1Explain: "",
          option2Audit: "YES",
          option2Explain: "",
          option3Audit: "YES",
          option3Explain: "",
          option4Audit: "YES",
          option4Explain: "",
          option5Audit: "YES",
          option5Explain: "",
          option6Audit: "YES",
          option6Explain: "",
          option7Audit: "YES",
          option7Explain: "",
          auditResult: "APPROVED"
        },
        individualTownAuditVo: {
          auditTime: null,
          auditUserId: null,
          option1Audit: "YES",
          option1Explain: "",
          option2Audit: "YES",
          option2Explain: "",
          option3Audit: "YES",
          option3Explain: "",
          option4Audit: "YES",
          option4Explain: "",
          auditResult: "APPROVED"
        }
      },
      rules: {
        individualApplyVo: {
          applicantName: [{ required: true, message: "请完善信息" }],
          applicantNum: [{ required: true, message: "请完善信息" }],
          address: [{ required: true, message: "请完善信息" }],
          mobilePhone: [{ required: true, message: "请完善信息" }],
          reclaimTypeId: [{ required: true, message: "请完善信息" }],
          reclaimWhereId: [{ required: true, message: "请完善信息" }],
          familyMemberList: [{ required: true, message: "请完善信息" }],
          certificateTypeId: [{ required: true, message: "请完善信息" }],
          certificateNum: [{ required: true, message: "请完善信息" }],
          issueCertificateDate: [{ required: true, message: "请完善信息" }],
          landArea: [{ required: true, message: "请完善信息" }],
          obligeeName: [{ required: true, message: "请完善信息" }],
          landAddress: [{ required: true, message: "请完善信息" }],
          isRemain: [{ required: true, message: "请完善信息" }],
          attachment1Id: [{ required: true, message: "请完善信息" }],
          attachment2Id: [{ required: true, message: "请完善信息" }],
          attachment3Id: [{ required: true, message: "请完善信息" }],
          attachment4Id: [{ required: true, message: "请完善信息" }],
          attachment5Id: [{ required: true, message: "请完善信息" }],
          regionId: [{ required: true, message: "请完善信息", trigger: "blur" }]
        },
        individualVillageAuditVo: {
          auditTime: [{ required: true, message: "请完善信息" }],
          auditUserId: [{ required: true, message: "请完善信息" }],
          option1Audit: [{ required: true, message: "请完善信息" }],
          option1Explain: [{ required: true, message: "请完善信息" }],
          option2Audit: [{ required: true, message: "请完善信息" }],
          option2Explain: [{ required: true, message: "请完善信息" }],
          option3Audit: [{ required: true, message: "请完善信息" }],
          option3Explain: [{ required: true, message: "请完善信息" }],
          option4Audit: [{ required: true, message: "请完善信息" }],
          option4Explain: [{ required: true, message: "请完善信息" }],
          option5Audit: [{ required: true, message: "请完善信息" }],
          option5Explain: [{ required: true, message: "请完善信息" }],
          option6Audit: [{ required: true, message: "请完善信息" }],
          option6Explain: [{ required: true, message: "请完善信息" }],
          option7Audit: [{ required: true, message: "请完善信息" }],
          option7Explain: [{ required: true, message: "请完善信息" }],
          auditResult: [{ required: true, message: "请完善信息" }]
        },
        individualTownAuditVo: {
          auditTime: [{ required: true, message: "请完善信息" }],
          auditUserId: [{ required: true, message: "请完善信息" }],
          option1Audit: [{ required: true, message: "请完善信息" }],
          option1Explain: [{ required: true, message: "请完善信息" }],
          option2Audit: [{ required: true, message: "请完善信息" }],
          option2Explain: [{ required: true, message: "请完善信息" }],
          option3Audit: [{ required: true, message: "请完善信息" }],
          option3Explain: [{ required: true, message: "请完善信息" }],
          option4Audit: [{ required: true, message: "请完善信息" }],
          option4Explain: [{ required: true, message: "请完善信息" }],
          auditResult: [{ required: true, message: "请完善信息" }]
        }
      },
      option1TypeList: {
        option1Type: false,
        option2Type: false,
        option3Type: false,
        option4Type: false,
        option5Type: false,
        option6Type: false,
        option7Type: false
      },
      option2TypeList: {
        option1Type: false,
        option2Type: false,
        option3Type: false,
        option4Type: false
      },
      fileList: [{ type: "身份证正面" }, { type: "身份证反面" }, { type: "户口簿家庭成员关系" }, { type: "权证证明" }, { type: "	农户去向证明" }],
      checkActiveName: "cs",
      auditorData: [],
      auditorItem1: {},
      auditorItem2: {},
      RECLAIM_TYPE: [],
      RECLAIM_WHERE: [],
      CERTIFICATE_TYPE: [],
      familyForm: {
        name: null,
        relation: null,
        mobile: null,
        num: null
      },
      familyMode: "add",
      familyDialog: false,
      familyIndex: null,
      familyRules: {
        name: [{ required: true, message: "请输入姓名" }],
        relation: [{ required: true, message: "请输入与申请人关系" }],
        mobile: [{ required: true, message: "请输入手机号码" }],
        num: [{ required: true, message: "请输入身份证号码" }]
      },

      props: {
        lazy: true,
        label: "name",
        value: "id",
        lazyLoad(node, resolve) {
          let id = 1;
          if (node.data) {
            id = node.data.id;
          }
          getRegionListByParentId({
            parentId: id
          }).then(res => {
            resolve(res.data);
          });
        }
      },
      regionArr: null,
      btnLoading: false
    };
  },
  watch: {
    regionArr(arr) {
      this.validateForm.individualApplyVo.regionId = arr[2];
    }
  },
  created() {
    // this.handleDetail();
    this.validateForm.individualVillageAuditVo.auditTime = this.getTime();
    this.validateForm.individualTownAuditVo.auditTime = this.getTime();
    this.getSelectData();
    this.queryAllAuditor();
  },
  methods: {
    //添加家庭成员
    handleAddFamilyList() {
      this.familyDialog = true;
      this.familyMode = "add";

    },
    handleReset(name) {
      this.familyDialog = false;
      this.$nextTick(() => {
        this.$refs[name].resetFields();
      });
    },
    handleFamilyDialogClose(){
      this.familyDialog = false;
      this.familyForm.name = null;
      this.familyForm.relation = null;
      this.familyForm.mobile = null;
      this.familyForm.num = null;
    },
    //改变状态
    changeType(v, type) {
      switch (type) {
        case 1:
          this.option1TypeList.option1Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option1Explain = "";
          }
          break;
        case 2:
          this.option1TypeList.option2Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option2Explain = "";
          }
          break;
        case 3:
          this.option1TypeList.option3Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option3Explain = "";
          }
          break;
        case 4:
          this.option1TypeList.option4Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option4Explain = "";
          }
          break;
        case 5:
          this.option1TypeList.option5Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option5Explain = "";
          }
          break;
        case 6:
          this.option1TypeList.option6Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option6Explain = "";
          }
          break;
        case 7:
          this.option1TypeList.option7Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualVillageAuditVo.option7Explain = "";
          }
          break;
      }
    },
    changeStatus(v, type) {
      switch (type) {
        case 1:
          this.option2TypeList.option1Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualTownAuditVo.option1Explain = "";
          }
          break;
        case 2:
          this.option2TypeList.option2Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualTownAuditVo.option2Explain = "";
          }
          break;
        case 3:
          this.option2TypeList.option3Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualTownAuditVo.option3Explain = "";
          }
          break;
        case 4:
          this.option2TypeList.option4Type = v == "YES" ? false : true;
          if (v == "YES") {
            this.validateForm.individualTownAuditVo.option4Explain = "";
          }
          break;
      }
    },
    getSelectData() {
      let arr = ["RECLAIM_TYPE", "RECLAIM_WHERE", "CERTIFICATE_TYPE"];
      arr.forEach((item, index) => {
        getLandApplyType({
          dictionaryType: item
        }).then(res => {
          this[arr[index]] = res.data;
        });
      });
    },

    queryAllAuditor() {
      queryAllAuditor().then(res => {
        this.auditorData = res.data;
      });
    },
    handleSubmit() {
      let flag1 = false;
      let flag2 = false;
      let flag3 = false;
      let uploadFlag = false;
      this.$refs["individualApplyVo"].validate(valid => {
        flag1 = valid;
      });
      this.$refs["individualVillageAuditVo"].validate(valid => {
        flag2 = valid;
      });
      this.$refs["individualTownAuditVo"].validate(valid => {
        flag3 = valid;
      });
      if (this.validateForm.individualApplyVo.familyMemberList.length <= 0) {
        this.$alert("至少添加一个家庭成员");
        return;
      }
      if (this.validateForm.individualApplyVo.attachment1Id == "" && this.validateForm.individualApplyVo.attachment1Id == null) {
        this.$alert("请上传身份证正面");
        return;
      }
      if (!this.validateForm.individualApplyVo.attachment2Id == "" && this.validateForm.individualApplyVo.attachment2Id == null) {
        this.$alert("请上传身份证反面");
        return;
      }
      if (!this.validateForm.individualApplyVo.attachment3Id == "" && this.validateForm.individualApplyVo.attachment3Id == null) {
        this.$alert("请上传户口簿家庭成员关系");
        return;
      }
      if (!this.validateForm.individualApplyVo.attachment4Id == "" && this.validateForm.individualApplyVo.attachment4Id == null) {
        this.$alert("请上传权证证明");
        return;
      }
      if (!this.validateForm.individualApplyVo.attachment5Id == "" && this.validateForm.individualApplyVo.attachment5Id == null) {
        this.$alert("请上传农户去向证明");
        return;
      }

      if (flag1 && flag2 && flag3) {
        individualApplySubmit(this.validateForm).then(res => {});
      } else {
        this.$alert("还有未完善的信息")
          .then(_ => {})
          .catch(_ => {});
      }
    },
    handleCoding() {
      this.$confirm("Coding...")
        .then(_ => {})
        .catch(_ => {});
    },
    handleCancel() {
      this.$confirm("此操作将返回上一页, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$router.push({ name: "个人申请与审核" });
        })
        .catch(() => {});
    },
    handleAuditUserChange(val, type) {
      if (type == "auditor1") {
        this.auditorData.forEach(item => {
          if (item.userId == val) {
            this.auditorItem1 = item;
          }
        });
      }
      if (type == "auditor2") {
        this.auditorData.forEach(item => {
          if (item.userId == val) {
            this.auditorItem2 = item;
          }
        });
      }
    },
    handleAddFamily() {
      this.$refs["familyForm"].validate(valid => {
        if (valid) {
          let _data = {};
          _data = this.familyForm;
          if (this.familyMode == "add") {
            this.validateForm.individualApplyVo.familyMemberList.push(JSON.parse(JSON.stringify(_data)));
          } else {
            this.validateForm.individualApplyVo.familyMemberList.splice(this.familyIndex, 1, JSON.parse(JSON.stringify(_data)));
          }
          this.familyDialog = false;
        }
      });
    },
    handleEditFamily(index, row) {
      this.familyIndex = index;
      this.familyMode = "edit";
      this.familyForm.name = row.name;
      this.familyForm.relation = row.relation;
      this.familyForm.mobile = row.mobile;
      this.familyForm.num = row.num;
      this.familyDialog = true;
    },
    handleDelFamily(index) {
      this.validateForm.individualApplyVo.familyMemberList.splice(index, 1);
    },
    handleBeforeUpload(e) {
      this.btnLoading = true;
    },
    handleUpload(res, index) {
      this.btnLoading = false;
      this.$message({
        message: "上传成功",
        type: "success"
      });
      this.validateForm.individualApplyVo["attachment" + (index + 1) + "Id"] = res.data.id;
    },
    getTime() {
      var timeStr = "-";
      var curDate = new Date();
      var curYear = curDate.getFullYear(); //获取完整的年份(4位,1970-????)
      var curMonth = curDate.getMonth() + 1 < 10 ? "0" + (curDate.getMonth() + 1) : curDate.getMonth() + 1; //获取当前月份(0-11,0代表1月)
      var curDay = curDate.getDate() < 10 ? "0" + curDate.getDate() : curDate.getDate(); //获取当前日(1-31)
      var curHour = curDate.getHours() < 10 ? "0" + curDate.getHours() : curDate.getHours(); //获取当前小时数(0-23)
      var curMinute = curDate.getMinutes() < 10 ? "0" + curDate.getMinutes() : curDate.getMinutes(); // 获取当前分钟数(0-59)
      var curSec = curDate.getSeconds() < 10 ? "0" + curDate.getSeconds() : curDate.getSeconds(); //获取当前秒数(0-59)
      var Current = curYear + timeStr + curMonth + timeStr + curDay + " " + curHour + ":" + curMinute + ":" + curSec;
      return Current;
    }
  }
};
</script>

<style lang="scss" scoped>
.module-item {
  width: 100%;
  background-color: #fff;
}

.module-item-title {
  width: 100%;
  background: #f8f8f8;
  height: 50px;
  border: 1px solid #efefef;
  overflow: hidden;
  font-size: 14px;
  color: #48494d;
  font-weight: bold;
  text-indent: 20px;
  line-height: 50px;
}

.module-item-content {
  width: 100%;
  border: 1px solid #ebebeb;
  border-top: none;
  padding: 30px;
  padding-top: 0;
  box-sizing: border-box;
}

.form {
  /deep/ .el-input {
    width: 200px;
  }
}

.submit-box {
  text-align: center;
  margin-top: 20px;
}
</style>
<style lang="scss" scoped>
.form-inline-item {
  .explain {
    /deep/ .el-form-item__label {
      width: 70px !important;
    }

    /deep/ .el-textarea {
      width: 500px;
      margin-left: 0;
    }
  }

  /deep/ .el-form-item__label {
    width: 350px !important;
    text-align: left;
  }

  /deep/ .el-input {
    margin-left: 20px;
  }

  .fujianShenClass {
    /deep/ .el-form-item__label {
      width: 400px !important;
      text-align: left;
    }
  }
}

#personApplyCheck .layout-box {
  /deep/ .el-form-item__label {
    width: 150px !important;
  }

  /deep/ .el-form-item__content {
    margin-left: 150px !important;
  }

  .title {
    display: inline-block;
    color: #48494d;
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 16px;
    margin-right: 10px;
  }
}
</style>
 